import React,{useEffect,useState} from 'react'
import * as echarts from 'echarts';
import { GET_STUDENT } from '../../api/student';
type EChartsOption = echarts.EChartsOption;
function twoRight() {
  const [place,setPlace]=useState<string[]>([])
  useEffect(()=>{
      GET_STUDENT().then((res: any)=>{
        console.log(res);
        setPlace(res.data.data.result.legend)
        console.log(res.data.data.result);
        console.log(place);
        
      })
    var chartDom = document.getElementById('wuwu')!;
var myChart = echarts.init(chartDom);
var option: EChartsOption;

option = {
  legend: {},
  tooltip: {},
  dataset: {
    dimensions: ['product', '2015', '2016', '2017'],
    source: [
      { product: 'Matcha Latte', '2015': 43.3, '2016': 85.8, '2017': 93.7 },
      { product: 'Milk Tea', '2015': 83.1, '2016': 73.4, '2017': 55.1 },
      { product: 'Cheese Cocoa', '2015': 86.4, '2016': 65.2, '2017': 82.5 },
      { product: 'Walnut Brownie', '2015': 72.4, '2016': 53.9, '2017': 39.1 }
    ]
  },
  xAxis: { type: 'category' },
  yAxis: {},
  series: [{ type: 'bar' }, { type: 'bar' }, { type: 'bar' }]
};

option && myChart.setOption(option);


  },[])
  return (
     <div id="wuwu" style={{width: '22vw',height:'33vh'}}></div>
  )
}

export default twoRight
